<extend name="_layout/main"/>
<block name="head">
    <style>
        .hselect select {
            margin: 0;
            padding: 0;
            width: 80%;
        }
    </style>
</block>
<block name="top">
    <header class="mui-bar mui-bar1 mui-bar-nav mui-bar-nav1" id="header">
        <a class="btn" href="javascript:history.go(-1)">
            <i class="iconfont icon-fanhui"></i>
        </a>
        <div class="top-sch-box top-sch-boxtwo top-sch-boxthree flex-col">
            返回
        </div>
    </header>
</block>
<block name="content">
    <form name="applyForm" id="applyForm" action="{:U('apply_operations')}">
        <div class="warp warpthree clearfloat">
            <include file="_layout/member_head"/>
            <div class="apply clearfloat">
                <div class="bottom clearfloat">
                    <ul>
                        <li>
                            <div class="box-s clearfloat">
                                <p>代理金额：</p>
                                <input type="text" id="amount" name="amount" value=""
                                       placeholder="代理金额，最低￥{$setting.min_user_operations_amount}"/>
                            </div>
                        </li>
                        <li>
                            <div class="box-s clearfloat">
                                <p>申请账户：</p>
                                <input type="text" id="username" name="username" value="" placeholder="申请账户ID/手机号"/>
                            </div>
                        </li>

                        <li>
                            <div class="box-s clearfloat hselect">
                                <p>支付方式：</p>
                                <select name="pay_type" id="pay_type">
                                    <option value="1">全部现金</option>
                                    <option value="2">
                                        {$setting.pay_balance_percent}%现金+{$setting.pay_integral_percent}%积分
                                    </option>
                                </select>
                            </div>
                        </li>
                        <li>
                            <div class="box-s clearfloat hselect">
                                <p>代理地区：</p>
                                <select name="province" id="province">
                                    <option value="">请选择省</option>
                                    <volist name="area" id="item">
                                        <eq name="item.area_parent_id" value="0">
                                        <option value="{$item.area_id}">{$item.area_name}</option>
                                        </eq>
                                    </volist>
                                </select>
                            </div>
                        </li>
                        <li>
                            <div class="box-s clearfloat hselect">
                                <p>代理地区：</p>
                                <select name="city" id="city">
                                    <option value="">请选择城市</option>

                                </select>
                            </div>
                        </li>
                        <li>
                            <div class="box-s clearfloat hselect">
                                <p>代理地区：</p>
                                <select name="area" id="area">
                                    <option value="">请选择县/区</option>

                                </select>
                            </div>
                        </li>
                    </ul>
                </div>

                <a href="javascript:void(0)" class="center-btn db ra3" id="btn-save">提交</a>
            </div>
        </div>
    </form>
    <div class="recharge clearfloat">
        <div class="guize clearfloat box-s ra3">
            <h3>申请运营中心规则</h3>
            <div class="content clearfloat">
                {$setting.apply_operations_annouce|stripslashes|htmlspecialchars_decode}
            </div>
        </div>
    </div>
</block>
<block name="scripts">
    <script type="text/javascript" src="__JS__/jquery.form.js"></script>
    <script>
        $(document).on('click', '#btn-save', function (e) {
            e.preventDefault();
            var form = $("#applyForm");
            if (!form.is('form')) {
                return;
            }
            var action = form.attr("action");
            var data = form.serialize();
            if (action && data) {
                $.post(action, data, function (xdata) {
                    if (xdata.status == 'success') {
                        mui.alert(xdata.message, '提示',function(){
                            form[0].reset();
                        });
                    } else {
                        mui.alert(xdata.message, '错误提示');
                    }
                }, 'json');
            }
        })

        $(document).on('change', '#province', function (e) {
            var pid = $(this).val();
            if (pid) {
                $.ajax({
                    url: "{:U('get_city')}",
                    type: 'get',
                    dataType: 'json',
                    data: {pid: pid},
                    success: function (xdata) {
                        if (xdata) {
                            var html = '<option value="">选择城市</option>';
                            for (var i in xdata) {
                                html += '<option value="' + xdata[i].area_id + '">' + xdata[i].area_name + '</option>'
                            }
                            $("#city").html(html);
                        }
                    }
                })
            }
        })

        $(document).on('change', '#city', function (e) {
            var pid = $(this).val();
            if (pid) {
                $.ajax({
                    url: "{:U('get_city')}",
                    type: 'get',
                    dataType: 'json',
                    data: {pid: pid},
                    success: function (xdata) {
                        if (xdata) {
                            var html = '<option value="">选择县/区</option>';
                            for (var i in xdata) {
                                html += '<option value="' + xdata[i].area_id + '">' + xdata[i].area_name + '</option>'
                            }
                            $("#area").html(html);
                        }
                    }
                })
            }
        })
    </script>
</block>